<script setup lang="ts">
const props = withDefaults(
  defineProps<{ theme?: "black" | "white"; disable?: boolean }>(),
  {
    theme: "black",
    disable: false
  }
);
const emit = defineEmits(["click"]);

const onClick = () => {
  if (props.disable) {
    return;
  }
  emit("click");
};
</script>

<template>
  <view :class="['img', theme, { disable }]" @click="onClick" />
</template>
<style scoped lang="scss">
.img {
  width: 36rpx;
  height: 36rpx;
  background-size: cover;
  background-repeat: no-repeat;
  &.black {
    background-image: url("https://wealth-1311286543.cos.ap-guangzhou.myqcloud.com/taoshe/static/icon_send-black.svg");
  }
  &.white {
    background-image: url("https://wealth-1311286543.cos.ap-guangzhou.myqcloud.com/taoshe/static/icon_send-white.svg");
  }
  &.disable {
    background-image: url("https://wealth-1311286543.cos.ap-guangzhou.myqcloud.com/taoshe/static/icon_send-disable.svg");
  }
}
</style>
